<template>
	<view class="tabBar">
		<view v-for="(item,index) in tabBarList" :key="index" :class="['tab-item',{'mid-button':index == 1}]"
			@click="tabBarChange(index,item.url)">
			<image :src="current == index?item.selectIcon: item.icon"></image>
			<view :class="['tab-title',{'activeTitle':current == index}]">{{item.name}}</view>
		</view>
	</view>
</template>

<script>
	import {
		permissionCheck,
		phonePermissionSetting
	} from "@/utils/permission.js";
	export default {
		props: {
			current: {
				type: Number,
				default: 0 // 默认为首页
			}
		},
		data() {
			return {
				// tabbar 栏
				tabBarList: [{
					name: "首页", // name
					icon: "/static/image/home1.png", // 图标
					selectIcon: "/static/image/home2.png", // 选中图标
					url: "/pages/index/index", // 页面路径
				}, {
					name: "",
					icon: "/static/image/scan-code.png",
					selectIcon: "/static/image/scan-code.png",
					url: "",
				}, {
					name: "我的",
					icon: "/static/image/my2.png",
					selectIcon: "/static/image/my1.png",
					url: "/pages/my/index",
				}]
			}
		},

		mounted() {
			uni.hideTabBar();
		},
		methods: {
			tabBarChange(index, path) {
				let token = uni.getStorageSync('token') || null;
				if (!token && index > 0) {
					uni.showModal({
						title: '提示',
						content: '需要先授权登录哦，是否继续？',
						success: function(res) {
							if (res.confirm) {
								uni.reLaunch({
									url: '/pages/login/index'
								})
							}
						}
					})
					return;
				}
				if (path) {
					uni.switchTab({
						url: path
					})
					return;
				}
				this.doScan();
			},

			isScanning() {
				let that = this;
				uni.scanCode({
					onlyFromCamera: true,
					scanType: ['qrCode'],
					success: function(res) {
						let str = res.result;
						let inx1 = str.indexOf('CHZD');
						let inx2 = str.indexOf('CC');
						let index = inx1 !== -1 ? inx1 : inx2;
						let code = str.substr(index, str.length);

						uni.reLaunch({
							url: `/pages/index/index?blueName=${code}`
						})
					},
					fail: (err) => {
						that.$Toast.none('扫码失败！');
					}
				});
			},

			//扫码
			doScan() {
				// #ifdef MP-WEIXIN
				this.isScanning()
				// #endif

				//由于ios的机制问题，只有用过该功能它的权限列表才会出现该权限的设置,ios调用第一次就可直接打开相机
				// #ifndef MP-WEIXIN
				const iosFirstOpenCamera = uni.getStorageSync('SET_IOS_FIRST_OPEN_CAMERA') //这里是获取vuex 或者 storage 存储的变量
				if (uni.getSystemInfoSync().platform === 'ios' && !iosFirstOpenCamera) {
					//把判断ios这个变量置为false
					uni.setStorageSync('SET_IOS_FIRST_OPEN_CAMERA', true);
					this.isScanning();
				} else {
					permissionCheck().then(res => {
						this.isScanning()
					}).catch(err => {
						uni.showModal({
							title: '手机权限',
							content: err,
							success: function(res) {
								if (res.confirm) {
									phonePermissionSetting()
								} else if (res.cancel) {}
							}
						});
					})
				}
				// #endif
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tabBar {
		width: 100%;
		height: 120rpx;
		display: flex;
		align-items: center;
		position: fixed;
		left: 0;
		bottom: 0;
		background-color: #FFFFFF;
		border-top: 1px solid #F8F8F8;

		.tab-item {
			width: 45%;
			display: flex;
			flex-direction: column;
			align-items: center;

			.tab-title {
				font-size: 24rpx;
				color: #ababab;
			}

			.activeTitle {
				color: #0081ff;
			}

			image {
				width: 56rpx;
				height: 56rpx;
				padding-bottom: 10rpx;
			}
		}

		.mid-button {
			width: 20%;
			position: relative;
			top: -42rpx;
			background: #fff;
			padding-top: 20rpx;
			border-radius: 50%;

			image {
				width: 80rpx;
				height: 80rpx;
			}
		}

	}
</style>